import React, { Component } from 'react';
import Taro from '@tarojs/taro';
import {View, Image, Button, Navigator, Block} from '@tarojs/components'
import {AtIcon} from 'taro-ui'
import {platform} from "../../utils/platform-settting.service";
import {user} from '../../utils/user.service'
import {h5Wx} from "../../utils/h5.service";
import {getTempSellerId, vcmonitor} from "../../utils/tools";
import GzhAuth from "../../components/gzh-auth/gzh-auth"
import {UPDATE_USER_SHARE_DATE} from "../../constants/api";
import {http} from "../../utils/http";
import './redbag.scss'

export default class Redbag extends Component {
  state: {
    sellerId: string
    userId: string
    nickName: string
    show: boolean
  } = {
    sellerId: '',
    userId: '',
    nickName: '',
    show: false
  }

  async UNSAFE_componentWillMount() {
    vcmonitor(this)
  }

  shareParams = ''

  async componentDidShow() {
    let userId = ''
    let sellerId = ''
    let identity
    const isLogin = await user.checkLogin()
    if (!isLogin) {
      Taro.showToast({
        title: '你还未登录，请登录',
        icon: 'none'
      })
      const timer = setTimeout(() => {
        clearTimeout(timer)
        user.jumpLogin()
      }, 1000)
      return false
    } else {
      identity = await user.getUserData()
      if (!identity) {
        return
      }
      userId = identity.userId
      sellerId = identity.sellerId
    }
    this.shareParams = await user.getSellerParams(getTempSellerId(this))
    if (process.env.TARO_ENV === 'h5') {
      await h5Wx.getConfig()
      const shareData = {
        title: platform.info.platformName,
        desc: "在吗？世界这么大，一起去看看，给你发红包了，记得领啊！",
        link: window.location.origin + '/common/redbag/help?userId=' + userId + '&sellerId=' + sellerId + '&bId=' + this.randomNumber() + `&${this.shareParams}`,
        imgUrl: 'https://resource.ivcheng.com/upload/images/20211016/1634361176897_371.png'
      }
      h5Wx.share(shareData)
      this.setState({userId, sellerId})
    } else {
      this.setState({userId, sellerId, nickName: identity.nickname || ''})
    }
  }

  onShareAppMessage() {
    if (process.env.TARO_ENV !== 'tt') {
      http.post(UPDATE_USER_SHARE_DATE, {})
    }
    return {
      title: this.state.nickName + "：在吗？世界这么大，一起去看看，给你发红包了，记得领啊！",
      path: '/common/redbag/help?userId=' + this.state.userId + '&sellerId=' + this.state.sellerId + '&bId=' + this.randomNumber() + `&${this.shareParams}` + `&sKey=${Taro.getStorageSync('sKey' || '')}`,
      imageUrl: 'https://resource.ivcheng.com/upload/images/20211016/1634361176897_371.png',
    }
  }

  randomNumber() {
    const now = new Date()
    const month = now.getMonth() + 1
    const day = now.getDate()
    const hour = now.getHours()
    const minutes = now.getMinutes()
    const seconds = now.getSeconds()
    return now.getFullYear().toString() + month.toString() + day + hour + minutes + seconds + (Math.round(Math.random() * 89 + 100)).toString()
  }

  shareWow() {
    const show = this.state.show
    this.setState({
      show: !show
    })
  }

  render() {
    const {show} = this.state
    return (
      <View className='redbag-out-root'>
        <GzhAuth />
        {process.env.TARO_ENV != 'h5' ? <Button className='custom_btn' openType='share'>
            <Image className='bgimg' mode='widthFix'
              src='https://resource.ivcheng.com/upload/images/20211016/1634361176897_371.png'
            />
          </Button>
          :
          <Block>
            <View className='custom_btn' onClick={this.shareWow.bind(this)}>
              <Image className='bgimg' mode='widthFix'
                src='https://resource.ivcheng.com/upload/images/20211016/1634361176897_371.png'
              />
            </View>
            {show && <View className='H5shareBox' onClick={this.shareWow.bind(this)}>
              <Image className='H5shareImg' src='https://resource.ivcheng.com/resources/images/H5sharebj.png'
                mode='widthFix'
              />
              <View className='H5shareBtn'>我知道了</View>
            </View>
            }
          </Block>
        }
        <View className='close'>
          <Navigator className='close-btn' openType='navigateBack' delta={1}><AtIcon value='close-circle' size='40'
            color='#EBCD9A'
          /></Navigator>
        </View>
      </View>
    )
  }
}
